// 答题记录页面JavaScript

document.addEventListener('DOMContentLoaded', function() {
    // 获取答题记录
    fetchQuizRecords();
    
    // 绑定筛选事件
    document.getElementById('record-filter').addEventListener('change', function() {
        filterRecords(this.value);
    });
});

// 获取答题记录
function fetchQuizRecords() {
    // 在实际应用中，这里应该从后端获取数据
    // 模拟数据
    const records = [
        {
            date: '2025-11-20 10:30:25',
            type: '看图选词',
            word: 'apple',
            result: true,
            time: 5.2
        },
        {
            date: '2025-11-20 10:31:10',
            type: '听音选词',
            word: 'banana',
            result: false,
            time: 8.7
        },
        {
            date: '2025-11-20 10:32:45',
            type: '看词选图',
            word: 'cat',
            result: true,
            time: 3.1
        }
    ];
    
    displayRecords(records);
}

// 显示答题记录
function displayRecords(records) {
    const tbody = document.querySelector('#records-table tbody');
    tbody.innerHTML = '';
    
    records.forEach(record => {
        const row = document.createElement('tr');
        row.innerHTML = `
            <td>${record.date}</td>
            <td>${record.type}</td>
            <td>${record.word}</td>
            <td>${record.result ? '正确' : '错误'}</td>
            <td>${record.time}秒</td>
        `;
        
        // 根据结果设置行样式
        if (!record.result) {
            row.style.backgroundColor = '#ffebee';
        }
        
        tbody.appendChild(row);
    });
}

// 筛选记录
function filterRecords(filter) {
    // 在实际应用中，这里应该重新从后端获取筛选后的数据
    // 这里只是模拟
    fetchQuizRecords();
}